﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>忘记密码</title>
    <link rel="stylesheet" href="/static/css/common/reset.css">
    <link rel="stylesheet" href="/static/css/forgetPwd.css" />
    <link rel="stylesheet" href="/static/css/sweetalert.min.css" />
</head>
<body>
    <section class="topbar forget">
        <div class="container clearfix">
            <div class="backhome fl"><a href="/index.html" class='backhome-text'>回到首页</a></div>
        </div>
    </section>
    <section class="for-content">
        <div class="container">
            <div class="for-con-top clearfix">
                <img class="for-cTop-logo fl" src="./static/images/forgetlogo.png" />
                <h1 class="for-cTop-title fl">让校园活动更出彩</h1>
            </div>
        </div>
    </section>
    <section class="for-getPassword">
        <a class="for-get-back" href="/login.html">返回登录</a>
        <ul class="for-get-title mt10 clearfix">
            <li class="active" id="firstStep">1 手机验证</li>
            <li id="secondStep">2 重置密码</li>
        </ul>
        <form id="form">
            <div class="for-getStepone" id="vidate">
                <input type="text" class="for-get-input mobile mt20" name="UserName" id="UserName" placeholder="请输入手机号码" required />
            
                <div class="for-get-code mt10 clearfix">
                    <input type="text" class="for-gCode-input code fl" placeholder="请输入验证码" required name="vcode" id="vcode" />
                    <img id="valiCode" class="codeImg" src="/api/login/GetValidateCode" alt="验证码" />
                </div>
                <div class="for-get-code mt10 clearfix">
                    <input type="text" class="for-gCode-input code fl" placeholder="请输入手机验证码" required name="code" id="code" />
                    <a href="javascript:void(0)" class="for-gCode-btn fl" id="getAuditcode">获取验证码</a>
                </div>
                <a class="for-get-btn mt10" href="javascript:void(0)" id="submit">找回密码</a>
            </div>
            <div class="for-getSteptwo hide" id="reset">
                <input type="password" name="newPassword" id="Password" class="for-get-input password mt20" placeholder="请输入新密码" />
                <input type="password" class="for-get-input password mt10" placeholder="请再次输入密码" />
                <a class="for-get-btn mt10" href="javascript:void(0)" id="btnReset">确 定</a>
            </div>
        </form>
    </section>
    <script type="text/javascript" src="/static/js/ref/jquery-2.1.1.min.js"></script>
    <script type="text/javascript" src="/static/js/self/common.js"></script>
    <script type="text/javascript" src="/static/js/ref/sha512.js"></script>
    <script src="/static/js/ref/sweetalert.min.js"></script>
    <script src="/static/js/self/util.js"></script>
    <script>
        $(function () {
            //登录框下拉
            $('.for-get-btn').on('click', function (e) {
                var self = $(this);
                self.parent().siblings().find('a').removeClass('on');
                self.toggleClass('on');
            });
        });

        function AfteAjaxPhone(ctx) {
            if (ctx == null || ctx == "") {
                common.alertMessage("用户不存在");
                return;
            }
            else if (ctx == "验证码错误") {
                common.alertMessage("图片验证码错误");
                return;
            }
            timeTick("#getAuditcode", 60, "获取验证码");
            common.alertMessage("验证码已经发出，请注意查收");
        }

        $("#getAuditcode").click(function () {

            var phoneNo = $('#UserName').val();
            var code = $('#vcode').val();
            if (!common.checkValue(phoneNo)) {
                common.alertMessage("请输入手机号码");
                return;
            }
            if (!common.checkValue(code)) {
                common.alertMessage("请输入图片验证码");
                return;
            }
            common.commonAjax({ type: 'Get', url: '/api/login/ValidatForgetPwd?id=' + phoneNo+'&vcode='+code, sMethod: AfteAjaxPhone });
        })
        function AfterAjax(ctx) {
            if (ctx.ResponseStr == "验证码错误")
                common.alertMessage("验证码错误");
            else {
                $("#vidate").addClass("hide");
                $("#reset").removeClass("hide");
                $("#firstStep").removeClass("active");
                $("#secondStep").addClass("active");
            }
        }
        function AfterReset(ctx) {
            if (ctx.ResponseStr == "验证码错误")
                common.alertMessage("验证码错误");
            else {
                common.showMessage("修改成功，可以去登录了", function () {

                    window.location = "/login.html";
                })

            }
        }
        $("#submit").click(function () {
            common.FormAjax({ type: 'Post', url: '/api/User/FindPassword', ID: "form", sMethod: AfterAjax });
        })

        $("#btnReset").click(function () {
            var values = common.GetCtrlValues({
                ContentID: "form"
            })

            common.commonAjax({ type: 'Post', url: '/api/User/ResetPassword', data: values, sMethod: AfterReset });
        })
        $("#valiCode").bind("click", function () {
            this.src = "/api/Login/GetValidateCode?time=" + (new Date()).getTime();
        });

    </script>
</body>
</html>
